<template>
	<view class="content">
		<image src="https://img.ams1.imgbed.xyz/2021/06/17/Hj2h6.jpg" mode="widthFix"></image>
		<image src="https://vkceyugu.cdn.bspapp.com/VKCEYUGU-6e1a92c2-19ad-4ad9-ba4a-caf65b14a00b/e9005405-b6c4-4b99-9e08-19ca16ddf8bb.png" mode="widthFix"></image>
		
		<button type="default" plain="true" hover-class="none" @click="loginByWeixin">
			<image src="https://vkceyugu.cdn.bspapp.com/VKCEYUGU-6e1a92c2-19ad-4ad9-ba4a-caf65b14a00b/c7398494-9869-4469-a8bc-43ef5103c8c1.png" mode="aspectFit"></image>
		</button>
	</view>
</template>

<script>
	// 客户端代码
	// 代码较长建议直接参考插件市场示例项目：https://ext.dcloud.net.cn/plugin?id=2116
	let weixinAuthService
	let code
	export default {
		data() {
			return {
				hasWeixinAuth: false
			}
		},
		onLoad() {
			// #ifdef APP-PLUS
			plus.oauth.getServices((services) => {
				weixinAuthService = services.find((service) => {
					return service.id === 'weixin'
				})
				if (weixinAuthService) {
					this.hasWeixinAuth = true
				}
			});
			// #endif
		},
		methods: {
			getWeixinCode() {
				return new Promise((resolve, reject) => {
					// #ifdef MP-WEIXIN
					uni.login({
						provider: 'weixin',
						success(res) {
							resolve(res.code)
						},
						fail(err) {
							reject(new Error('微信登录失败'))
						}
					})
					// #endif
					// #ifdef APP-PLUS
					weixinAuthService.authorize(function(res) {
						resolve(res.code)
						console.log(res);
					}, function(err) {
						console.log(err)
						reject(new Error('微信登录失败'))
					});
					// #endif
				})
			},
			loginByWeixin() {
				var that = this;
				uni.showLoading({
					title: '登陆中...'
				})
				uni.getUserProfile({
					desc: 'Wexin', // 这个参数是必须的
					success: res => {
						console.log(res)
						let userInfo = res.userInfo;
						// return
						this.getWeixinCode().then((code) => {
							console.log(code);
							code = code;
							return uniCloud.callFunction({
								name: 'login-by-weixin',
								data: {
									code
								}
							})
						}).then((res) => {
							// console.log(res);
							
							
							if (res.result.code === 0) {
								uni.setStorageSync('login_weixin', res.result);
								this.$store.state.uid = res.result.uid;
						
						
						
								this.addUserTable(res.result.uid,userInfo);
						
							}
						}).catch((err) => {
							uni.hideLoading();
							console.log(err);
							uni.showModal({
								showCancel: false,
								content: '微信登录失败，请稍后再试'
							})
						})
					},
					fail: err => {
						console.log(err);
						uni.hideLoading();
						uni.showModal({
							title: '登录',
							content: '登录失败，请重新登录',
							success(res) {
								if(res.confirm){
									that.loginByWeixin();
								}
							}
						})
					}
				})
				
			},

			// 添加用户
			addUserTable(uid,userInfo) {
				var that = this;
				// let num = this.$u.random(0, 1997)
				uniCloud.callFunction({
					name: 'userTable',
					data: {
						uid: uid,
						name: userInfo.nickName,
						avatar: userInfo.avatarUrl,
						sex: userInfo.gender,
						age: '',
						city: userInfo.city,
						province: userInfo.province,
						Introduction: '', // 简介
						label: '', // 标签
						bgImg: '',  // 个人中心背景图片
						tableName: 'user-table'
					},
					success(res) {
						console.log(res, "用户信息");
						// return
						// that.getUserInfo(uid);
						uni.setStorageSync("userInfo", res.result.data);
						uni.showToast({
							title: '登录成功',
							icon: 'none'
						})
						setTimeout(() => {
							uni.navigateBack({
								delta: 1
							})
						}, 1000)
					},
					fail(err) {
						console.log(err);
					}
				})
			},
			// 获取用户信息
			getUserInfo(uid) {
				uniCloud.callFunction({
					name: 'getUserInfo',
					data: {
						uid: uid
					},
					success(res) {
						uni.hideLoading();
						console.log(res);
						uni.setStorageSync("userInfo", res.result.data);
						uni.showToast({
							title: '登录成功',
							icon: 'none'
						})
						setTimeout(() => {
							uni.navigateBack({
								delta: 1
							})
						}, 1000)
					},
					fail(err) {
						console.log(err);
					}
				})
			}
		}
	}
</script>

<style scoped>
	.content{
		width: 100%;
		height: 100vh;
		position: relative;
		background-color: #021f65;
		overflow: hidden;
	}
	.content image:first-child{
		width: 100%;
		height: 100%;
		position: absolute;
		top: 0;
		left: 0;
	}
	.content image:nth-child(2){
		width: 100%;
		height: 100%;
		position: absolute;
		bottom: 0;
		left: 0;
	}
	.content image:nth-child(3){
		
	}
	button {
		width: 480rpx;
		height: 880rpx;
		position: absolute;
		bottom: 154rpx;
		right: -64rpx;
		/* background-color: rgba(0,0,0,0); */
		border: none !important;
	}
	button::after { border: none }
</style>
